<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%String path = request.getContextPath();%>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,target-densitydpi=high-dpi,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
	<title>微信签到系统-班级管理</title>
	<link rel="stylesheet" href="./css/bootstrap.css">
	<script src="./js/jquery.js"></script>
	<script src="./js/bootstrap.min.js"></script>
	<style>
		.control-group{
			margin-bottom:15px;
		}
		.table tr th,.table tr td{
			text-align: center;
		}
		.title h3{
			font-size:18px;
			margin:5px 0 5px 0;
			border-left:5px solid #eee;
			padding:3px 5px;
		}
		.btn-right{
			text-align: right;
		}
	</style>
</head>
<body>

<nav class="navbar navbar-default navbar-fixed-top">
	<div class="container">
		<div class="navbar-header">
                 <button class="navbar-toggle" data-toggle="collapse" data-target="#navbarCollapse">
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
                 </button>
                <a href="home" class="navbar-brand">微信签到系统</a>
          </div>
          <div class="collapse navbar-collapse" id="navbarCollapse">
			<ul class="nav navbar-nav" style="margin-top:0">
				<li><a href="teacher">教师管理</a></li>
          		<li  class="active"><a href="teacher?method=class">班级管理</a></li>
			</ul>
			<!-- 
				<a href="#" class="navbar-text navbar-link">超链接</a>
			 -->
			 <p class="navbar-text navbar-right">
			 	${adminInfo.roleName }：<a href="#">${adminInfo.username }</a> | 
			 	<a href="adminManager?method=logout">退出</a>
			 </p>
		</div>
	</div>
</nav>

<div class="main container" style="margin-top:60px;">
<p class="btn-right"><button type="button" onclick="openClassModal()" class="btn btn-info ">创建班级</button></p>
	<div class="table-container table-responsive">
		<table class="table table-striped table-hover table-responsive">
			<thead>
			<tr>
				<th>编号</th>
				<th>班级名称</th>
				<th>创建时间</th>
				<th>操作</th>
			</tr>
			</thead>
			<tbody>
			<c:choose>
				<c:when test="${page.list!=null && page.list.size()>0}">
					<c:forEach items="${page.list }" var="obj">
						<tr>
							<td>${obj.cid }</td>
							<td>${obj.className }</td>
							<td>${obj.createtime }</td>
							<td>
								<a href="teacher?method=class-student&cid=${obj.cid }"  >管理学生</a> | 
								<a href="teacher?method=class-delete&cid=${obj.cid }" title="删除班级"
								 onclick="return removeClass(this,'确定删除该班级么？这将删除班级下的所有学生！')">删除</a>
							 </td>
						</tr>
					</c:forEach>
				</c:when>
				<c:otherwise>
						<tr>
							<td colspan="8">暂无数据...</td>
						</tr>
				</c:otherwise>
			</c:choose>
			</tbody>
		</table>
		</div>
	 <ul class="pagination" id="pageul">
	 	<c:choose>
			<c:when test="${page.pageNow == 1}">
				<li class='disabled'><span>首页</span></li>
				<li class='disabled'><span>上一页</span></li>
			</c:when>
			<c:otherwise>
				<li><a href="javascript:void(0)">首页</a></li>
				<li><a href="javascript:void(0)">上一页</a></li>
			</c:otherwise>
		</c:choose>
			<c:forEach begin="${(page.navNo -1)*5 + 1}" end="${page.totalPage > 5*page.navNo?5*page.navNo:page.totalPage}" var="s">
				<li <c:if test='${page.pageNow == s}'>class='active'</c:if>><a href="javascript:void(0)">${s}</a></li>
			</c:forEach>
			<c:choose>
				<c:when test="${page.pageNow == page.totalPage}">
					<li class='disabled'><span>下一页</span></li>
					<li class='disabled'><span val="${page.totalPage}">尾页</span></li>
				</c:when>
				<c:otherwise>
					<li><a href="javascript:void(0)">下一页</a></li>
					<li><a href="javascript:void(0)" val="${page.totalPage}">尾页</a></li>
				</c:otherwise>
			</c:choose>
			<li  class="disabled"><span class="hidden-xs">总记录:${page.totalSize} | 页码:${page.pageNow}/${page.totalPage}</span></li>
	 </ul>

</div>
<script>
	$(function(){
		$("a").tooltip({
			delay:{
				show:100,
				hide:100,
			},
			container:'body'
		});
		pageul(${page.pageNow});
		$("#classId").val("${currentClassId}");
	})
	
	function removeClass(thisObj , msg){
			var r  = confirm(msg);
			if(r){
				url = $(thisObj).attr("href");
				$.get(url,function(rsp){
					obj = $.parseJSON(rsp);
					if(obj.rspCode==0000){
						location.reload();
					}else{
						alert("操作失败："+obj.rspDesc);
					}
				});
			}
			return false;
	}
	
	function openClassModal(){
		$("#createClassModal").modal();
	}

	function createClass(thisObj){
		var form = $("#addClassForm").serialize();
		$.ajax({
			type:"post",
			url:"teacher?method=class-add",
			data:form,
			success:function(rsp){
				obj = $.parseJSON(rsp);
				if(obj.rspCode==0000){
					location.reload();
				}else{
					alert("创建失败："+obj.rspDesc);
				}
			},
			error:function(err,status){
				alert("创建失败："+err.status);
			}
		});
	}

		/*初始化分页*/
	function pageul(page){
		$("#pageul > li > a").each(function() {
			$(this).click(function() {
				if ($(this).text() == '上一页') {
					showPage(page - 1);
					return;
				}else if ($(this).text() == '首页') {
					showPage(1);
					return;
				} else if ($(this).text() == '下一页') {
					showPage(page + 1);
					return;
				}else if ($(this).text() == '尾页') {
					showPage($(this).attr("val"));
					return;
				} else {
					showPage($(this).text());
				}
			});
		});
	}
		
	//分页	
	function showPage(pageNo){
		location.href="teacher?method=class&pageNo="+pageNo;
	}

</script>
   
<div class="modal" id="createClassModal" data-backdrop="static">
    	<div class="modal-dialog" style="max-width:600px;">
    		<div class="modal-content">
    			<div class="modal-header">
    				<button class="close" data-dismiss="modal">
						<span>&times;</span>
					</button>
					<span class="fui-new">创建班级</span>
    			</div>
    			<div class="modal-body">
    				<form method="post" action="?" class="form-horizontal" id="addClassForm">
					<div class="control-group">
						 <label class="control-label" for="className">班级名称</label>
						  <input id="className" class="form-control" type="text" maxlength="30"
						  name="className" placeholder="请填写班级名称"/>
					</div>
				</form>
    			</div>
    			 <div class="modal-footer">
    			 	 <button type="submit" class="btn btn-success" onclick="createClass(this)">确认创建</button>
			        <button class="btn btn-danger" data-dismiss="modal">关闭</button>
			      </div>
    		</div>
    	</div>
    </div>
</body>
</html>